<template>


        <div class="super_container">

                <myheader></myheader>
            
                <!-- Home -->
            
								
								<!-- Home -->

	<div class="home">
		<div class="parallax_background parallax-window" data-parallax="scroll" data-speed="0.8"></div>
		<div class="home_container">
			<div class="home_content">
				<div class="home_title">账单</div>
				<div class="breadcrumbs">
					<ul class="d-flex flex-row align-items-center justify-content-start">
						<li><a href="index.html">Home</a></li>
						<li><a href="cart.html">Your Cart</a></li>
						<li>Checkout</li>
					</ul>
				</div>
			</div>
		</div>
	</div>

	<!-- Checkout -->

	<div class="checkout">
		<div class="section_container">
			<div class="container">
				<div class="row">
					<div class="col">
						<div class="checkout_container d-flex flex-xxl-row flex-column align-items-start justify-content-start">
							
						

							<!-- Cart Total -->
							<div class="cart_total">
								<div class="cart_total_inner checkout_box">
									<div class="checkout_title">Order</div>
									<ul class="cart_extra_total_list">
										<li class="d-flex flex-row align-items-center justify-content-start">
											<div class="cart_extra_total_title">订单创建时间</div> <p class="err-msg" v-html="err"></p><p class="err-msg" v-html="err"></p>
											<div class="cart_extra_total_value ml-auto">{{ orders_info.order_start_time }}</div>
										</li>
							
										<li class="d-flex flex-row align-items-center justify-content-start">
											<div class="cart_extra_total_title">价钱</div>
											<div class="cart_extra_total_value ml-auto">${{ orders_info.order_price }}</div>
										</li>
										<li class="d-flex flex-row align-items-center justify-content-start">
											<div class="cart_extra_total_title">订单号</div>
											<div class="cart_extra_total_value ml-auto">{{  orders_info.outer_traed_number }}</div>
										</li>
										<li class="d-flex flex-row align-items-center justify-content-start">
											<div class="cart_extra_total_title">总价</div>
											<div class="cart_extra_total_value ml-auto">{{ orders_info.order_price }}</div>
										</li>
						
									</ul>

									<div>
										<div class="checkout_button trans_200"><a @click="refund()">退款</a></div>
										<div><button v-on:click='getkefu'>客服聊天</button></div>
									</div>
									<!-- Order Text -->

									<!-- <div class="checkout_button trans_200" v-if="order_info.status === 1 "><a>已经支付</a></div> -->
									<!-- <div class="checkout_button trans_200" ><a>已经支付</a></div> -->
									<!-- <div class="checkout_button trans_200" ><a @click="checkout()">去支付</a></div> -->
									<!-- <div class="checkout_button trans_200" v-else><a @click="checkout()">去支付</a></div> -->
									<!-- <a href="/order_list">查看我的订单</a> -->
								</div>

							</div>

						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
            
                
            
                <!-- Footer -->
            
                <myfooter></myfooter>


            
            
            </div>

      
</template>
      
      
       
      <script>


        import myheader from './header.vue'
		import myfooter from './footer.vue'
		import Cookies from 'js-cookie'
     
      
      export default {
        data () {
          return {
            msg: "",
            dataList:[],
            clicked:0,
			upath: '',
			err: '&#12288;',
			result: '',
			orders_info: [],
			uping:0,
			orders_detail_info:[],
			token:''
          }
        },
        components: {
        'myheader':myheader,
        'myfooter':myfooter
        },
        mounted:function(){

			this.common.get_menu();
			let order_id = this.$route.query.order_id

			let url = this.base_url+'/Order_infoHandler'
			let _this = this
			let orders_detail_info = this.orders_detail_info
			let orders_info = this.orders_info
			let token = localStorage.getItem('token')

		
			this.axios.post(url,this.qs.stringify({'order_id':order_id}))
			.then(function(result) {
				console.log(result.data)
				_this.orders_info = result.data.orders_info
				_this.orders_detail_info = result.data.orders_detail_info
       
             }); 
		
			
        },
        methods:{
            changetest(index){
                this.clicked = index;
			},

			// 退款接口调用
			refund:function(){
				let url = this.base_url + '/Refund'

				let _this = this

				_this.axios.post(url,this.qs.stringify({'out_trade_no':this.orders_info.outer_traed_number, 'refund_amount':this.orders_info.order_price}))

				.then(function(result){
				
				if(result.data.code == 200){

					alert(result.data.mes)
					window.location.href = 'http://localhost:8080/'
				}
			})
			},
			getkefu:function() {
				 this.$router.push({path:'/kefu'})
                    },




            

        }	
      }
      
      
      </script>
       
      <style>


			

			@import '../assets/styles/checkout.css';
			@import '../assets/styles/checkout_responsive.css';
      
      
      
      </style>